/* 数据库管理 */
<template>
  <div>
    <Tabs type="card" closable @on-tab-remove="handleTabRemove">
        <TabPane label="数据库管理">
            <Card :bordered="false">
              <p slot="title">
                <Row>
                    <Col span="8" style="line-height: 32px">
                      一级账号
                    </Col>
                    <Col span="2" offset="14">
                       <Button style="float:right" type="info">添加</Button>
                    </Col>
                </Row>
              </p>
              <p>
                <Table border :columns="columns1" :data="data1"></Table>
              </p>
            </Card>
            <Card :bordered="false">
              <p slot="title">
                <Row>
                    <Col span="8" style="line-height: 32px">
                      数据库备份恢复
                    </Col>
                    <Col span="2" offset="14">
                       <Button style="float:right" type="info">备份</Button>
                    </Col>
                </Row>
              </p>
              <p>
                <Table border :columns="columns2" :data="data2"></Table>
              </p>
            </Card>
        </TabPane>
      </Tabs>
  </div>
</template>

<script>
  export default {
     data() {
    return {
      columns1: [{
          title: '数据库文件',
          key: 'file',
        },
        {
          title: '操作',
          key: 'operation',
          width: 240,
          align: 'center',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '8px'
                },
                on: {
                  click: () => {
                    this.show(params.index)
                  }
                }
              }, '查看'),
              h('Button', {
                props: {
                  type: 'success',
                  size: 'small'
                },
                style: {
                  marginRight: '8px'
                },
                on: {
                  click: () => {
                    this.remove(params.index) // 需要改
                  }
                }
              }, '修改'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.remove(params.index)
                  }
                }
              }, '删除')
            ]);
          }
        }
      ],
      columns2: [{
          title: '备份人',
          key: 'person',
        },
        {
          title: '备份ID',
          key: 'id',
        },
        {
          title: '备份大小',
          key: 'size',
        },
        {
          title: '备份时间',
          key: 'time',
        },
        {
          title: '操作',
          key: 'operation',
          width: 240,
          align: 'center',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '8px'
                },
                on: {
                  click: () => {
                    this.donlow(params.index) //需要改
                  }
                }
              }, '下载'),
              h('Button', {
                props: {
                  type: 'success',
                  size: 'small'
                },
                style: {
                  marginRight: '8px'
                },
                on: {
                  click: () => {
                    this.remove(params.index) // 需要改
                  }
                }
              }, '恢复'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.remove(params.index)
                  }
                }
              }, '删除')
            ]);
          }
        }
      ],
      data1: [{
          file: '国民经济行业分类与代码'
        },
        {
          file: '行政区划数据库_with经纬度-省市区-邮编-区号-拼音-简称'
        },
        {
          file: '环境影响工程师数据库'
        },
        {
          file: '环境报告表模板'
        },
        {
          file: '建设项目环境影响评价分类管理名录2018修订'
        },
        {
          file: '建设项目环评审批基础信息表V1013版'
        }
      ],
      data2: [{
          person: '张三',
          id: '',
          size: '1.6M',
          time: '2018-09-19'
        },
        {
          person: '张三',
          id: '',
          size: '1.6M',
          time: '2018-09-19'
        },
        {
          person: '张三',
          id: '',
          size: '1.6M',
          time: '2018-09-19'
        },
        {
          person: '张三',
          id: '',
          size: '1.6M',
          time: '2018-09-19'
        }
      ]
    }
  },

  methods: {
    rowClick() {
      this.$router.push("/admin/main/IndexOperation");
    },
    handleTabRemove(name) {
      this["tab" + name] = false;
    }
  }
  }
</script>

<style scoped>

</style>
